<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
    <title>产测</title>
    <link href="/public/static/css/layui.css" rel="stylesheet">
</head>
<style>
    /* Basic Grey */

    .basic-grey {

        margin-left: auto;

        margin-right: auto;

        max-width: 100%;

        background: #F7F7F7;

        padding: 25px 15px 25px 10px;


        color: #888;

        text-shadow: 1px 1px 1px #FFF;

        border: 1px solid #E4E4E4;

    }

    .basic-grey h1 {

        font-size: 25px;

        padding: 0px 0px 10px 40px;

        display: block;

        border-bottom: 1px solid #E4E4E4;

        margin: -10px -15px 30px -10px;;

        color: #888;

    }

    .basic-grey h1 > span {

        display: block;

        font-size: 11px;

    }

    .basic-grey label {

        display: block;

        margin: 0px;

    }

    .basic-grey label > span {

        float: left;

        width: 45%;

        text-align: right;

        padding-right: 10px;

        margin-top: 10px;

        color: #888;

    }

    .basic-grey input[type="number"], .basic-grey input[type="text"], .basic-grey input[type="email"], .basic-grey textarea, .basic-grey select {

        border: 1px solid #DADADA;

        color: #888;

        height: 30px;

        margin-bottom: 16px;

        margin-right: 6px;

        margin-top: 2px;

        outline: 0 none;

        padding: 3px 3px 3px 5px;

        width: 40%;

        font-size: 12px;

        line-height: 15px;

        box-shadow: inset 0px 1px 4px #ECECEC;

        -moz-box-shadow: inset 0px 1px 4px #ECECEC;

        -webkit-box-shadow: inset 0px 1px 4px #ECECEC;

    }

    .basic-grey textarea {

        padding: 5px 3px 3px 5px;

    }

    .basic-grey select {

        background: #FFF no-repeat right;

        background: #FFF no-repeat right;

        appearance: none;

        -webkit-appearance: none;

        -moz-appearance: none;

        text-indent: 0.01px;

        text-overflow: '';

        width: 40%;

        height: 35px;

        line-height: 25px;

    }

    .basic-grey textarea {

        height: 100px;

    }

    .basic-grey .button {

        background: #E27575;

        border: none;

        padding: 10px 25px 10px 25px;

        color: #FFF;

        box-shadow: 1px 1px 5px #B6B6B6;

        border-radius: 3px;

        text-shadow: 1px 1px 1px #9E3F3F;

        cursor: pointer;

    }

    .basic-grey .button:hover {

        background: #CF7A7A

    }

    /* 悬停添加箭头图标 */
    .niceButton5 {
        display: inline-block;
        border-radius: 20px;
        background-color: #f4511e;
        border: none;
        color: #ffff;
        text-align: center;
        font-size: 20px;
        font-weight: 180;
        padding: 12px;
        width: 105px;
        transition: all 0.5s;
        cursor: pointer;
        margin: 5px;
        vertical-align: middle;
    }

    .niceButton8 {
        display: inline-block;
        border-radius: 20px;
        background-color: #00a0e9;
        border: none;
        color: #ffff;
        text-align: center;
        font-size: 20px;
        font-weight: 180;
        padding: 12px;
        width: 220px;
        transition: all 0.5s;
        cursor: pointer;
        margin: 5px;
        vertical-align: middle;
    }

    .niceButton5 span {
        cursor: pointer;
        display: inline-block;
        position: relative;
        transition: 0.5s;
    }

    .niceButton5 span::after {
        content: ">";
        position: absolute;
        opacity: 0;
        top: 0;
        right: -20px;
        transition: 0.5s;
    }

    .niceButton5:hover span {
        padding-right: 30px;
    }

    .niceButton5:hover span::after {
        opacity: 1;
        right: 0;
    }

    /* 悬停添加箭头图标 */
    .niceButton6 {
        display: inline-block;
        border-radius: 20px;
        background-color:#00a0e9;
        border: none;
        color: #ffff;
        text-align: center;
        font-size: 20px;
        font-weight: 180;
        padding: 12px;
        width: 105px;
        transition: all 0.5s;
        cursor: pointer;
        margin: 5px;
        vertical-align: middle;
    }

    .niceButton7 {
        display: inline-block;
        border-radius: 20px;
        background-color: #2ac06d;
        border: none;
        color: #ffff;
        text-align: center;
        font-size: 20px;
        font-weight: 180;
        padding: 12px;
        width: 105px;
        transition: all 0.5s;
        cursor: pointer;
        margin: 5px;
        vertical-align: middle;
    }

    .niceButton6 span,.niceButton7 span,niceButton8 span {
        cursor: pointer;
        display: inline-block;
        position: relative;
        transition: 0.5s;
    }

    .niceButton6 span::after,  .niceButton7 span::after,  .niceButton8 span::after {
        content: ">";
        position: absolute;
        opacity: 0;
        top: 0;
        right: -20px;
        transition: 0.5s;
    }

    .niceButton6:hover span,.niceButton7:hover span,.niceButton8:hover span {
        padding-right: 30px;
    }

    .niceButton6:hover span::after ,.niceButton7:hover span::after,.niceButton8:hover span::after{
        opacity: 1;
        right: 0;
    }

</style>
<script src="/public/static/js/layui.js"></script>
<body>
<div style="background: #f7f7f7;width: 100%">
        <button onclick="scanQRCode()" class="niceButton5"><span>扫描</span></button>
        <button onclick="showAll()" class="niceButton6"><span>全部</span></button>
        <button onclick="reload()" class="niceButton7"><span>重载</span></button>
        <button onclick="update()" class="niceButton5"><span>提交</span></button>
        <button onclick="startPort()" class="niceButton8">端口测试</button>
</div>
<div method="post" class="basic-grey">
    <h2 id="device_no" style="margin-left:10%;"></h2>
    <br/>

<!--    <div id="start_port" style="display: none;margin-top:20px;">-->
        <label style="margin-top:5px;">
            <span>开启端口:</span>
            <input id="port" value="1" type="text"/>
        </label>
    <label>

        <span> 一级经销商 :</span>

        <select id="distributor" name="distributor">

            <option value="0">请选择</option>

        </select>

    </label>
    <div style="display: none;">
        <label>
            <span>时长(分钟) :</span>
            <input id="minutes" value="1" type="text"/>
        </label>

        <label>
            <span>费用 :</span>
            <input id="start_fee" value="1" type="text"/>
        </label>
    </div>
<!--    </div>-->
    <label style="display: none">

        <span>设备编号 :</span>

        <input id="deviceNum" value="待扫描" disabled="true" type="text"/>

    </label>

    <label>

        <span>第1档最大充电功率(瓦)</span>

        <input id="power_max_1" value="" type="number"/>

    </label>
    <label>

        <span>第2档最大充电功率(瓦)</span>

        <input id="power_max_2" value="" type="number"/>

    </label>
    <label>

        <span>第3档最大充电功率(瓦)</span>

        <input id="power_max_3" value="" type="number"/>

    </label>
    <label>

        <span>第4档最大充电功率(瓦)</span>

        <input id="power_max_4" value="" type="number"/>

    </label>
    <label>

        <span>最大浮冲功率(瓦)</span>

        <input id="full_power_min" value="" type="number"/>

    </label>

    <label>

        <span>浮冲时间(分钟)</span>

        <input id="full_charge_time" value="" type="number"/>

    </label>
    <label>
        <span> <button onclick="changeIot()">扫码更换</button>-物联网编号 :</span>
        <input id="iot_sn" value="" type="text"/>
    </label>
    <label>
        <span>是否充满自停</span>
        <input type="radio" id="is_power_end" style="margin-top:10px;" name="sp_full_empty" value="1"/>是
        <input type="radio" id="not_power_end" style="margin-top:10px;" name="sp_full_empty" value="0">否
    </label>
    <div id="is_show" style="display: none;margin-top:10px;">

        <label>

            <span>投币充电时间(单位分钟):</span>

            <input id="coin_min" value="" type="number"/>

        </label>

        <label>

            <span>刷卡充电时间(单位分钟):</span>

            <input id="card_min" value="" type="number"/>

        </label>

        <label>

            <span>单次投币电量:单位(0.1度)</span>

            <input id="coin_elec" value="" type="text"/>

        </label>

        <label>

            <span>单次刷卡电量:单位(0.1度)</span>

            <input id="card_elec" value="" type="text"/>

        </label>

        <label>

            <span>刷卡扣费金额(角)</span>

            <input id="cst" value="" type="number"/>

        </label>

        <label>

            <span>第2档充电时间百分比</span>

            <input id="power_2_time" value="" type="number"/>

        </label>

        <label>

            <span>第3档充电时间百分比</span>

            <input id="power_3_time" value="" type="number"/>

        </label>


        <label>

            <span>第3档充电时间百分比</span>

            <input id="power_4_time" value="" type="number"/>

        </label>


        <label>
            <span>是否初始显示电量</span>
            <input type="radio" id="male" style="margin-top:10px;" name="elec_time_first" value="1"/>是

            <input type="radio" id="female" style="margin-top:10px;" name="elec_time_first" value="0">否
        </label>
        <br/>
        <label>
            <span>是否支持余额回收</span>
            <input type="radio" id="is_refund" style="margin-top:10px;" name="sp_rec_mon" value="1"/>是
            <input type="radio" id="not_refund" style="margin-top:10px;" name="sp_rec_mon" value="0">否
        </label>

    </div>


</div>
<div id="result"></div>
<script src="https://ylc.yimitongxun.com/public/static/js/jquery-v3.6.4.min.js"></script>
<script src="https://res2.wx.qq.com/open/js/jweixin-1.6.0.js"></script>
<script>
    var is_show = 0;
    var port_show = 0;
    $(function () {
        getDistributor()
        $.ajax({
            type: "GET",
            url: "/api/pro_set?uri=" + encodeURI(location.href),
            dataType: "json",
            data: {},
            success: function (res) {
                wx.config({
                    debug: false, // 开启调试模式,调用的所有api的返回值会在客户端alert出来，若要查看传入的参数，可以在pc端打开，参数信息会通过log打出，仅在pc端时才会打印。
                    appId: res.data.appId, // 必填，公众号的唯一标识
                    timestamp: res.data.timestamp, // 必填，生成签名的时间戳
                    nonceStr: res.data.nonceStr, // 必填，生成签名的随机串
                    signature: res.data.signature,// 必填，签名
                    jsApiList: res.data.jsApiList// 必填，需要使用的JS接口列表
                });
            },
        })
    });

    function getDistributor(){
        $.ajax({
            type: "GET",
            url: "/api/distributors/all?type=",
            dataType: "json",
            data: {},
            success: function (res) {
                var htmlStr = '<option value="0">请选择</option>';
                if(res.code == 200){
                    for(var i in res.data){
                        htmlStr += '<option value="'+res.data[i]['id']+'">'+res.data[i]['name']+'</option>';
                    }
                }
                $("#distributor").html(htmlStr);
            },
        })
    }

    // 扫描二维码
    function scanQRCode() {
        wx.scanQRCode({
            needResult: 1,
            scanType: ['qrCode'],
            success: function (res) {
                var result = res.resultStr;
                const queryString = result.split('?')[1];
                const urlParams = new URLSearchParams(queryString);
                var param = urlParams.get('sn');
                const sn = param.split('-')[0];
                $("#deviceNum").val(sn);
                reload()
            },
            fail: function (res) {

            }
        });
    }

    function changeIot() {
        wx.scanQRCode({
            needResult: 1,
            scanType: ['qrCode'],
            success: function (res) {
                var result = res.resultStr;
                var myArray = result.split(";");
                $("#iot_sn").val(myArray[0]);
            },
            fail: function (res) {

            }
        });
    }

    function reload(){
        var sn = $("#deviceNum").val();
        if(!sn){
            layer.msg("设备编号不存在");
            return ;
        }
        $.ajax({
            type: "GET",
            url: "/api/get_device_params?sn="+sn,
            dataType: "json",
            data: {},
            success: function (res) {
                layer.msg(res.msg);
                if(res.code == 200){
                    $("#full_power_min").val(res.data.full_power_min);
                    $("#power_max_1").val(res.data.power_max_1);
                    $("#power_max_2").val(res.data.power_max_2);
                    $("#power_max_3").val(res.data.power_max_3);
                    $("#power_max_4").val(res.data.power_max_4);
                    $("#full_charge_time").val(res.data.full_charge_time);
                    $('input[name="sp_full_empty"][value='+res.data.sp_full_empty+']').prop('checked', true);
                    $('input[name="elec_time_first"][value='+res.data.elec_time_first+']').prop('checked', true);
                    $('input[name="sp_rec_mon"][value='+res.data.sp_rec_mon+']').prop('checked', true);
                    $("#iot_sn").val(res.data.iot_sn);
                    $("#coin_min").val(res.data.coin_min);
                    $("#card_min").val(res.data.card_min);
                    $("#coin_elec").val(res.data.coin_elec);
                    $("#card_elec").val(res.data.card_elec);
                    $("#cst").val(res.data.cst);
                    $("#power_2_time").val(res.data.power_2_time);
                    $("#power_3_time").val(res.data.power_3_time);
                    $("#power_4_time").val(res.data.power_4_time);
                    $("#device_no").html("设备编号:"+sn+'--信号['+res.data.signal+']');
                    $("#distributor").val(res.data.distributor_id);
                }
            },
        })
    }

    function update(){
        var sn = $("#deviceNum").val();
        if(!sn || sn == '待扫描'){
            layer.msg("设备编号不存在");
            return ;
        }
        var powerValues = {
            distributor_id:$("#distributor").val(),
            sn:$("#deviceNum").val(),
            full_power_min:$("#full_power_min").val(),
            power_max_1: $("#power_max_1").val(),
            power_max_2:$("#power_max_2").val(),
            power_max_3:$("#power_max_3").val(),
            power_max_4:$("#power_max_4").val(),
            full_charge_time:$("#full_charge_time").val(),
            iot_sn:$("#iot_sn").val(),
            coin_min:$("#coin_min").val(),
            card_min: $("#card_min").val(),
            coin_elec: $("#coin_elec").val(),
            card_elec:$("#card_elec").val(),
            cst : $("#cst").val(),
            power_2_time : $("#power_2_time").val(),
            power_3_time : $("#power_3_time").val(),
            power_4_time : $("#power_4_time").val(),
            sp_full_empty : $('input[name="sp_full_empty"]:checked').val(),
            elec_time_first : $('input[name="elec_time_first"]:checked').val(),
            sp_rec_mon:$('input[name="sp_rec_mon"]:checked').val()
        }
        $.ajax({
            type: "POST",
            url: "/api/update_params",
            dataType: "json",
            data: {powerValues:powerValues},
            success: function (res) {
                 layer.msg(res.msg);
            }
        });
        // var full_power_min = $("#full_power_min").val();
        // var power_max_1 = $("#power_max_1").val();
        // var power_max_2 =$("#power_max_2").val();
        // var power_max_3 =$("#power_max_3").val();
        // var power_max_4 = $("#power_max_4").val();
        // var full_charge_time =$("#full_charge_time").val();
        // var iot_sn = $("#iot_sn").val();
        // var coin_min = $("#coin_min").val();
        // var card_min = $("#card_min").val();
        // var coin_elec = $("#coin_elec").val();
        // var card_elec = $("#card_elec").val();
        // var cst = $("#cst").val();
        // var power_2_time = $("#power_2_time").val();
        // var power_3_time = $("#power_3_time").val();
        // var power_4_time = $("#power_4_time").val();
        // var sp_full_empty = $('input[name="sp_full_empty"]:checked').val();
        // var elec_time_first = $('input[name="elec_time_first"]:checked').val();
        // var sp_rec_mon = $('input[name="sp_rec_mon"]:checked').val();
    }

    function startPort(){
        var iot_sn = $("#iot_sn").val();
        var fee = $("#start_fee").val();
        var minutes = $("#minutes").val();
        var port = $("#port").val();
        if(!iot_sn){
            layer.msg("请先获取设备参数");
            return ''
        }
        $.ajax({
            type: "POST",
            url: "/api/start_port",
            dataType: "json",
            data: {iot_sn:iot_sn,fee:fee,minutes:minutes,port:port},
            success: function (res) {
                 layer.msg(res.msg);
            }
        });
    }

    function showAll(){
        if(is_show == 0){
            $("#is_show").show();
            is_show = 1;
            $(".niceButton6").html("隐藏")
        }else{
            is_show = 0;
            $(".niceButton6").html("全部");
            $("#is_show").hide();
        }
    }
</script>
</body>
</html>
